*{margin: 0px; padding: 0px;}
li{list-style: none; }
a{text-decoration: none;}
img{vertical-align: bottom;}

:root{
	--background:#292F34;
}



.banner{
	width:1000px;
	height: 475px;
	margin:20px auto;
	position: relative;
	overflow: hidden;
}
.banner>a{
		 	width: 59px;
		 	height: 80px;
		 	position: absolute;
		 	top: 50%;
		 	margin-top: -40px;
		 	opacity: 0.4;
		 	transition: 0.5s;
		 	z-index: 7;
 }
.banner ul{
	position: absolute;
	left: 0px;
}
#list li>img{
  width: 1000px;
  height: 475px;
}
#prev{
	background: url(../img/pre.png);
	left: 0px;
}
#next{
	background: url(../img/next.png);
	right: 0px;
}

.page-body{
	
	width:1000px;
	margin: 10px auto;
}

.hot-title{
	width:1000px;
	height:30px;
	margin: 20px auto;
	text-align:center;
	font-size:12px;
	border-bottom: 1px solid #CCC;

}
.product>ul{
	flex-wrap:wrap;
	;
}
.product>ul>li{
	margin-bottom:20px;
	

}
.product{
	width:1000px;
	margin:0 auto;
	
}
.product-page{
	width:316px;
	height:316px;
    transition: 2s;
	position: relative;
}
.product-page>img{
	width:100%;
	
}
.product-info{
	margin-top:10px;
	width:316px;
	height:40px;
}

.product-info>a{
	height:100%;
	
	
}
.product-info>a>img{
	width: 40px;
	
	margin-right: 10px;
	
}
.product-info>a>span{
	font-size: 12px;
	width: 100%;
}
.product-page:hover .maker{
	display: block;
}
.maker{
	width:316px;
	height:316px;
	background: rgba(0,0,0,.7);
	position: absolute;
	left:0px;
	top:0px;
	
	display:none;
}
.maker>a :nth-child(1){
	font-size: 30px;
	font-style: italic;
	color: #7DBFDE;
	margin:10px 0px 80px 10px;
	
}
.maker>a :nth-child(2){
	
	font-size: 15px;
	font-style: italic;
	color: white;
	margin:10px 10px 20px 10px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	
}
.maker>a :nth-child(3){
	font-size: 13px;
	font-style: italic;
	color: white;
	text-align: center;
}

.more{
	    width: 140px;
	    height: 42px;
	    border: 3px solid #242930;
	    text-align: center;
	    line-height: 42px;
	    color: #242930;
	    font-weight: bold;
	    font-style: italic;
	    margin: 80px auto 0px;
	    cursor: pointer;
	    transition: 0.5s;
}
.more:hover{
	color: white;
	background: #242930;
}
